<template>
    <view class="con">
        <view style="width: 100%;" >
            <view class="input-bg">
                <text>手机号</text>
                <input type="number" placeholder="请输入您的手机号" maxlength="11" v-model="data.mobile"/>
            </view>
            <view class="line"></view>
            <view class="input-bg">
                <text>姓名</text>
                <input type="text" placeholder="请输入您的姓名" v-model="data.name"/>
            </view>
            <view class="line" v-if="type == 2"></view>
            <view class="input-bg" v-if="type == 2">
                <text>身份证号</text>
                <input type="text" placeholder="请输入您的身份证号" maxlength="18" v-model="data.id_card"/>
            </view>
        </view>
        
        <view style="width: 100%;margin-top: 30rpx;" v-if="type == 1">
            <view class="input-bg">
                <text>站点名称</text>
                <input type="text" placeholder="请输入回收站点名称"  v-model="data.service_name"/>
            </view>
            <view class="line"></view>
            <view class="input-bg" @click="fixedAddress()">
                <text>定位地址</text>
                <view class="region">
                    <view>{{ress}}</view>
                    <image src="../../static/img/myhome/icon-dingwei@3x.png" mode="widthFix"></image>
                </view>
            </view>
        </view>
        
        <view class="bu" @click="send">提交申请</view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                type: null,
                pickerShow: false,
                ress: '请定位站点地址',
                data: {
                    name: '',
                    mobile: '',
                    id_card: '',
                    service_name: '',
                    latitude: '',
                    longitude: '',
                },
            }
        },
        onLoad(e) {
            this.type = e.type;
            if(e.type == 1) {
                uni.setNavigationBarTitle({
                    title: '回收点申请'
                });
            } else if(e.type == 2) {
                uni.setNavigationBarTitle({
                    title: '分销申请'
                });
            }
        },
        methods: {
            fixedAddress() {
                uni.chooseLocation({
                    success: (res) => {
                        this.ress = res.address;
                        this.data.latitude = res.latitude;
                        this.data.longitude = res.longitude;
                    }
                });
            },
            send() {
                if(this.type == 1) {
                    if(!this.$u.test.mobile(this.data.mobile)) {
                        uni.showToast({
                            title: '请输入正确手机号',
                            duration: 1500,
                            icon: 'none'
                        });
                        return;
                    } else if(this.$u.test.isEmpty(this.data.name)) {
                        uni.showToast({
                            title: '姓名不能为空',
                            duration: 1500,
                            icon: 'none'
                        });
                        return;
                    } else if(this.$u.test.isEmpty(this.data.service_name)) {
                        uni.showToast({
                            title: '申请站点名称不能为空',
                            duration: 1500,
                            icon: 'none'
                        });
                        return;
                    } else if(this.$u.test.isEmpty(this.data.latitude) || this.$u.test.isEmpty(this.data.longitude)) {
                        uni.showToast({
                            title: '请定位站点地址',
                            duration: 1500,
                            icon: 'none'
                        });
                        return;
                    } else {
                        this._postCreateServer();
                    }
                } else if(this.type == 2) {
                    if(!this.$u.test.mobile(this.data.mobile)) {
                        uni.showToast({
                            title: '请输入正确手机号',
                            duration: 1500,
                            icon: 'none'
                        });
                        return;
                    } else if(this.$u.test.isEmpty(this.data.name)) {
                        uni.showToast({
                            title: '姓名不能为空',
                            duration: 1500,
                            icon: 'none'
                        });
                        return;
                    } else if(!this.$u.test.idCard(this.data.id_card)) {
                        uni.showToast({
                            title: '请输入正确身份证号',
                            duration: 1500,
                            icon: 'none'
                        });
                        return;
                    } else {
                        this._postChangUserType();
                    }
                }
            },
            //站点申请
            _postCreateServer() {
                this.$u.api.postCreateServer({
                    name: this.data.name,
                    phone: this.data.mobile,
                    service_name: this.data.service_name,
                    latitude: this.data.latitude,
                    longitude: this.data.longitude,
                }).then(res => {
                    uni.showModal({
                        title: '提示',
                        content: '申请成功，等待审核',
                        showCancel: false,
                        success: function (res) {
                            if (res.confirm) {
                                uni.navigateBack({
                                    delta: 1
                                });
                            }
                        }
                    });
                }).catch(err => {
                    uni.showToast({
                        title: err.msg,
                        duration: 1000,
                        icon: 'none'
                    });
                })
            },
            //类型申请
            _postChangUserType() {
                this.$u.api.postChangUserType({
                    name: this.data.name,
                    mobile: this.data.mobile,
                    id_card: this.data.id_card,
                    is_hs: 2,
                }).then(res => {
                    uni.showModal({
                        title: '提示',
                        content: '申请成功，等待审核',
                        showCancel: false,
                        success: function (res) {
                            if (res.confirm) {
                                uni.navigateBack({
                                    delta: 1
                                });
                            }
                        }
                    });
                }).catch(err => {
                    uni.showToast({
                        title: err.msg,
                        duration: 1000,
                        icon: 'none'
                    });
                })
            }
        }
    }
</script>

<style lang="scss" scoped>
    .con {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 30rpx;
        
        .line {
            width: 630rpx;
            height: 2rpx;
            background-color: #f2f2f2;
        }
        
        .input-bg {
            width: 100%;
            // height: 98rpx;
            background-color: #ffffff;
            border-radius: 20rpx;
            padding: 30rpx;
            display: flex;
            align-items: center;
            
            text {
                flex: 3;
                font-size: 28rpx;
                font-weight: bold;
                color: #191919;
            }
            
            input {
                flex: 7;
            }
            
            .region {
                flex: 7;
                display: flex;
                justify-content: space-between;
                align-items: center;
                color: #666666;
                font-size: 28rpx;
                
                image {
                    width: 30px;
                }
            }
            
            .text {
                font-size: 28rpx;
                font-weight: bold;
                color: #191919;
                margin-bottom: 30rpx;
            }
            
        }
        
        .bu {
            width: 600rpx;
            height: 88rpx;
            background-color: #1bc078;
            border-radius: 44rpx;
            font-size: 30rpx;
            color: #ffffff;
            text-align: center;
            line-height: 88rpx;
            margin-top: 60rpx;
        }
    }
</style>
